<template>
  <div class="content">
    <!-- 大图 -->
    <banner :banner="banner" />
    <!-- 用户导航条 -->
    <user-bar />
    <!--秒杀模块 seckill -->
    <spike v-if="seckill.status" :data="seckill" />
    <!-- 特价模块（specialoffer） -->
    <recommend v-if="specialoffer.status" :data="specialoffer" />
    <!-- 店铺街 -->
    <shop
      title="店铺专题"
      v-if="recommend_shop.status"
      :data="recommend_shop"
    />
    <!-- 品牌街 -->
    <brand v-if="false" />
    <!-- 今日推荐 -->
    <day-recommend v-if="recommend.status" :data="recommend" />
  </div>
</template>

<script>
import api from "@/api";
import Banner from "./banner";
import UserBar from "./userbar";
import Recommend from "./recommend";
import DayRecommend from "./dayrecommend";
import Spike from "./spike";
import Brand from "./brand";
import Shop from "./shop";
export default {
  name: "Home",
  components: { Banner, UserBar, Recommend, Spike, DayRecommend, Brand, Shop },
  created() {
    this.getIndexData();
  },
  data() {
    return {
      banner: [],
      seckill: {},
      specialoffer: {},
      recommend_shop: {},
      recommend: {},
    };
  },
  methods: {
    async getIndexData() {
      let data = await api.INDEX_DATA();
      this.banner = data.banner.banner;
      this.seckill = data.seckill; // 秒杀
      this.specialoffer = data.specialoffer; // 特价
      this.recommend_shop = data.recommend_shop; // 店铺专题
      this.recommend = data.recommend; // 店铺专题

      console.log(data);
      console.log(data.recommend);
    },
  },
};
</script>

<style lang="scss" scoped>
.content {
}
</style>
